<!DOCTYPE html>
<!--[if IE 9]>
    <html class="lt-ie10" lang="en">
    <![endif]-->
    <html class="no-js" lang="en">

    <head>
    	<meta charset="utf-8">
    	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    	<title><?php echo $this->pageTitle;?></title>
		<meta name="description" content="<?php echo $this->arrSystem[0]->description;?>">
		
    	<link rel="stylesheet" href="<?php echo Yii::app()->theme->baseUrl;?>/stylesheet/normalize.css">
    	<link rel="stylesheet" href="<?php echo Yii::app()->theme->baseUrl;?>/stylesheet/foundation.css">
		<link rel="stylesheet" href="<?php echo Yii::app()->theme->baseUrl;?>/stylesheet/common.css">
    	
    	<script src="javascript/vendor/modernizr.js"></script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>      
        <script type="text/javascript" src="<?php echo Yii::app()->theme->baseUrl;?>/javascript/jquery.easing.1.3.js"></script>
        <script type="text/javascript">
           $(document).ready(function(){
				var divOne = parseInt('-'+$("#section1").width());
				var divTwo = parseInt('-'+$("#section2").width());
				var divThree = parseInt('-'+$("#section3").width());
				
				$("#section2").css({'position':'absolute','right':divTwo});
				
				$('.btn-shop1').bind('click',function(event){
					if($(".is_shop").val() == 0){
						alert("Vui lòng chọn lĩnh vực website!");
						return false;
					}else{
						$("#formSubmit input[name=is_shop]").val(1);
						$(".cateTheme").val($(".is_shop").val());
						event.preventDefault();
						$("#section1").css({'position':'absolute'}).animate({marginLeft:divOne+'px'},800);
						$("#section2").show().animate({right:'0px'},600);
					}	
				});
				
				$("#section3").css({'position':'absolute','right':divThree});
				
				$('.btn-shop2').bind('click',function(event){
					
					if($(".is_business").val() == 0){
						alert("Vui lòng chọn lĩnh vực website!");
						return false;
					}else{
						$("#formSubmit input[name=is_shop]").val(0);
						$(".cateTheme").val($(".is_business").val());
						event.preventDefault();
						$("#section1").animate({marginLeft:divOne+'px'},800);
						$("#section2").show().animate({right:'0px'},600);
					}
				});
		   });
			
        </script>
    </head>

    <body>
    	<!-- body content here -->
    	<div class="section wapper-1"  id="section1">
    		<div class="header row">
	    		<h1 class="logo"><a href="<?php echo PIUrl::createUrl('/home/');?>"><img src="<?php echo Yii::app()->theme->baseUrl;?>/images/img-logo.png" alt=""></a></h1>
	    		<h2 class="title">Cách nhanh nhất để tạo 1 website <span class="orgrane">đẹp</span>,<span class="emerald">ấn tượng</span></h2>
	    	</div>
    		<div class="content row">
    			<h4 class="title"><a href="">Bắt đầu tạo website</a></h4>
    			<div class="content-left large-4 columns">
    				<span class="icon-shop"></span>
    				<h3 class="title">Cửa hàng, shop</h3>
    				<form action="">
    					<label for="">Lĩnh vực kinh doanh của bạn <span class="red">*</span> :</label>
    					<select class="is_shop" name="is_shop" id="">
    						<?php if(!empty($cateThemes)){ ?>
								<?php foreach($cateThemes as $key => $val){ ?>
									<option value="<?php echo $key; ?>"><?php echo $val; ?></option>
								<?php } ?>
							<?php } ?>
    					</select>
                        <a href="javascript:void(0)" class="btn-shop btn-shop1">Bắt đầu nào</a>
    				</form>
    			</div>
    			<div class="content-right large-4 columns">
    				<span class="icon-business"></span>
    				<h3 class="title">Doanh nghiệp</h3>
    				<form action="">
    					<label for="">Lĩnh vực kinh doanh của doanh nghiệp<span class="red">*</span> :</label>
    					<select class="is_business" name="is_business" id="">
    						<?php if(!empty($cateThemes)){ ?>
								<?php foreach($cateThemes as $key => $val){ ?>
									<option value="<?php echo $key; ?>"><?php echo $val; ?></option>
								<?php } ?>
							<?php } ?>
    					</select>
                        <a href="javascript:void(0)" class="btn-shop btn-shop2">Bắt đầu nào</a>
    				</form>
    			</div>
    		</div>

    		<div class="footer row"><p class="copyright">© 2014 Bản quyền thuộc về Kovo.vn</p></div>
    	</div>
        <div class="section wapper-2" id="section2">
            <div class="header row">
                <div class="large-12">
                    <div class="large-4 columns no-padding head-left">
                        <h1 class="logo-register"><a href="<?php echo PIUrl::createUrl('/home/');?>"><img src="<?php echo Yii::app()->theme->baseUrl;?>/images/img-logo.png" alt=""></a></h1>
                    </div>

                    <div class="large-4 columns head-right">
                        <span>Đăng nhập qua: &nbsp;</span>
                        <ul>
                            <li><a href=""><img src="<?php echo Yii::app()->theme->baseUrl;?>/images/icon-face.png" alt=""></a></li>
                            <li><a href=""><img src="<?php echo Yii::app()->theme->baseUrl;?>/images/icon-tt.png" alt=""></a></li>
                            <li><a href=""><img src="<?php echo Yii::app()->theme->baseUrl;?>/images/icon-gg.png" alt=""></a></li>
                            <li><a href=""><img src="<?php echo Yii::app()->theme->baseUrl;?>/images/icon-you.png" alt=""></a></li>
                        </ul>
                    </div>
                </div>

                <div class="large-12 columns">
                    <h2 class="title-register">Chào bạn! Chúng ta cùng thiết lập website ngay bây giờ</h2>
                </div>
                
            </div>
            <div class="main row">
                <div class="wd-form">
                    <fieldset>
                        <form method="post" action="<?php echo PIUrl::createUrl('/shop/registerTheme');?>" id="formSubmit">
                            <div class="wd-form-line large-12 columns">
                                <p>Bạn có muốn thay đổi lĩnh vực kinh doanh</p>
                                <select class="cateTheme" name="cateTheme" id="">
                                    <?php if(!empty($cateThemes)){ ?>
										<?php foreach($cateThemes as $key => $val){ ?>
											<option value="<?php echo $key; ?>"><?php echo $val; ?></option>
										<?php } ?>
									<?php } ?>
                                </select>
                            </div>
							<input type="hidden" name="is_shop" value=""/>
                            <div class="clearfix"></div>
                            <div class="wd-form-item large-6 columns">
                                <label for="">Tên cửa hàng <span class="red">*</span></label>
                                <input name="name_shop" class="input" type="text">
                            </div>
                            
							 <div class="wd-form-item large-6 columns">
                                <label for="">Tên web bạn muốn <span class="red">*</span></label>
                                <input name="domain" class="input" type="text">
                            </div>
                            <div class="wd-form-item large-6 columns">
                                <label for="">Địa chỉ <span class="red">*</span></label>
                                <input name="address" class="input" type="text">
                            </div>
							<div class="wd-form-item large-6 columns">
                                <label for="">Mật khẩu <span class="red">*</span></label>
                                <input name="pass" class="input" type="password">
                            </div>
                            <div class="wd-form-item large-6 columns">
                                <label for="">Họ và tên <span class="red">*</span></label>
                                <input class="input first-name" name="first_name" type="text"  placeholder="Tên">
                                <input class="input last-name" name="last_name" type="text"  placeholder="Họ đệm">
                                
                            </div>
                            
							<div class="wd-form-item large-6 columns">
                                <label for=""> Gõ lại mật khẩu<span class="red">*</span></label>
                                <input class="input" name="repass" type="password">
                            </div>
                            <div class="wd-form-item large-6 columns">
                                <label for="">Email <span class="red">*</span></label>
                                <input class="input" name="email" type="email" oninvalid="setCustomValidity('Nhập địa chỉ email')">
                            </div>
                            <div class="wd-form-item large-6 columns">
                                <label for="">Tỉnh/Thành phố <span class="red">*</span></label>
                                <select class="provinces" name="provinces" >
									<?php if(!empty($provinces)){ ?>
										<?php foreach($provinces as $province){ ?>
											<option value="<?php echo $province->id; ?>" <?php echo ($province->id == 57) ? "selected" : ""; ?>><?php echo $province->title; ?></option>
										<?php } ?>
									<?php } ?>
								</select>
                            </div>
							<div class="wd-form-item large-6 columns">
                                <label for="">Số điện thoại <span class="red">*</span></label>
                                <input class="input" name="phone" type="text">
                            </div>
                           
							<div class="wd-form-item large-6 columns">
                                <label for="">Quận/Huyện <span class="red">*</span></label>
                                <select class="wards" name="wards">
									<?php if(!empty($wards)){ ?>
										<?php foreach($wards as $key => $val){ ?>
											<option value="<?php echo $key; ?>"><?php echo $val; ?></option>
										<?php } ?>
									<?php } ?>
								</select>
                            </div>
                            <div class="large-12 columns">
                                <p>Chọn đăng ký là bạn đã đồng ý với Điều khoản dịch vụ và Chính sách bảo mật của Kovo.vn.</p>
                            </div>  
                            <div class="large-12 columns" style="text-align:center;margin-top:20px;"><button>Đăng ký</button>  </div>        
                        </form>         
                    </fieldset>
                </div>
            </div>
            <div class="footer row"><p class="copyright">© 2014 Bản quyền thuộc về Kovo.vn</p></div>
        </div>
    	<!--<script src="javascript/vendor/jquery.js"></script>-->
    	<script src="<?php echo Yii::app()->theme->baseUrl;?>/javascript/foundation.min.js"></script>
    	<script>
			$(document).foundation();
			
			$(document).load("pageload", function(){
				var id = $(".provinces").val();
				
				$.ajax({
					url : "<?php echo PIUrl::createUrl('/shop/getWards');?>"+"?id="+id,
					dataType : "json",
					success : function(result){
						var data = "";
						for(i=0; i<result.length; i++){
							data+="<option value='" + result[i].id +"'>" +result[i].title + "</option>";
						}
						$(".wards").html(data);
					},
				});
			});
			
			$(document).ready(function(){
				$(".provinces").change(function(){
					var id = $(this).val();
					
					$.ajax({
						url : "<?php echo PIUrl::createUrl('/shop/getWards');?>"+"?id="+id,
						dataType : "json",
						success : function(result){
							var data = "";
							for(i=0; i<result.length; i++){
								data+="<option value='" + result[i].id +"'>" +result[i].title + "</option>";
							}
							$(".wards").html(data);
						},
					});
				});
				// kiem tra du lieu form
				$("#formSubmit").submit(function(){
					
					if($(".cateTheme").val() == 0){
						alert("Vui lòng chọn lĩnh vực website!");
						return false;
					}else{
						var error = true; var i = 0;
						$(".input").each(function(){
							i++;
							if($(this).val() == ""){
								if(i == 5)
									$(this).attr("class", "input empty first-name");
								else{
									if(i == 6)	$(this).attr("class", "input empty last-name");
									else	$(this).attr("class", "input empty");
								}	
								error = false;
							}else{
								if(i == 5)
									$(this).attr("class", "input first-name");
								else{
									if(i == 6)	$(this).attr("class", "input last-name");
									else	$(this).attr("class", "input ");
								}	
							}
						});
						if(error == true){
							if($("input[name=pass]").val() != $("input[name=repass]").val()){
								alert("Mật khẩu xác nhận không trùng khớp!");
								$("input[name=repass]").attr("class", "input empty");
								return false;
							}else{
								var data = $('form').serialize();
								$.ajax({
									url: "<?php echo PIUrl::createUrl('/shop/RegisterTheme');?>",
									data: data,
									type: "post",
									success: function(result){
										if(result == false) alert("Tên website đã tồn tại!");
										else window.location.href = "<?php echo PIUrl::createUrl('/shop/chooseTheme');?>"+"?shop_id="+result;
									},
								});
								return false;
							}
						}else{	
							
							alert("Vùi lòng điền đầy đủ thông tin yêu cầu!");
							return false;
						}
					}
				});
			});
    	</script>
        <style>
			.empty{ border: solid 1px #2F9A4E !important; }
		</style>
    </body>

    </html>